<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <title>首页</title>
    <link rel="stylesheet" href="../librarys/swiper/css/swiper.min.css">
    <link rel="stylesheet" href="../librarys/font-awesome-4.5.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="../styles/css-mb.css">
</head>
<body>
    <!--头部-->
    <div class="index-head">
        <form>
            <div class="index-head-box">
                <div class="index-head-search">
                    <i class="fa fa-search fa-lg index-head-search-icon"></i>
                    <input class="index-head-search-input" type="text" placeholder="搜索商家、套餐">
                    <input class="index-head-search-submit" type="submit" value="搜索">
                </div>
                <a href="login-mb.html" class="index-icon-color">登录</a>
            </div>
        </form>
        <!-- Swiper -->
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide"><a href="#"><img src="../images/banner-daijinquan.jpg"></a> </div>
                <div class="swiper-slide"><a href="#"><img src="../images/banner-daijinquan.jpg"></a> </div>
                <div class="swiper-slide"><a href="#"><img src="../images/banner-daijinquan.jpg"></a> </div>
                <div class="swiper-slide"><a href="#"><img src="../images/banner-daijinquan.jpg"></a> </div>
            </div>
            <!-- Add Pagination -->
            <div class="swiper-pagination"></div>
        </div>
    </div>
    <!--列表-->
    <div class="index-list">
        <ul>
            <li>
                <a href="#">
                    <div class="index-list-icon color1">
                        <img src="../images/iconA-01.png">
                    </div>
                    <span>摄像师</span>
                </a>
            </li>
            <li>
                <a href="#">
                    <div class="index-list-icon color2">
                        <img src="../images/iconB-01.png">
                    </div>
                    <span>车队</span>
                </a>
            </li>
            <li>
                <a href="#">
                    <div class="index-list-icon color3">
                        <img src="../images/iconC-01.png">
                    </div>
                    <span>礼服</span>
                </a>
            </li>
            <li>
                <a href="#">
                    <div class="index-list-icon color4">
                        <img src="../images/iconD-01.png">
                    </div>
                    <span>摄影师</span>
                </a>
            </li>
            <li>
                <a href="#">
                    <div class="index-list-icon color5">
                        <img src="../images/iconH-01.png">
                    </div>
                    <span>化妆师</span>
                </a>
            </li>
            <li>
                <a href="#">
                    <div class="index-list-icon color6">
                        <img src="../images/iconE-01.png">
                    </div>
                    <span>酒店</span>
                </a>
            </li>
            <li>
                <a href="#">
                    <div class="index-list-icon color7">
                        <img src="../images/iconF-01.png">
                    </div>
                    <span>司仪</span>
                </a>
            </li>
            <li>
                <a href="#">
                    <div class="index-list-icon color8">
                        <img src="../images/iconG-01.png">
                    </div>
                    <span>花艺气球</span>
                </a>
            </li>
        </ul>
    </div>
    <div class="index-line"></div>
    <!--内容-->
    <div class="index-content">
        <ul>
            <li>
                <div class="index-content1">
                    <div class="index-content1-img"><img src="../images/index-hotel-img2.jpg"></div>
                    <div class="index-content1-text">
                        <a href="#">三亚旅拍&nbsp;&nbsp;内外景</a>
                        <p><span>¥198</span><del>¥258</del></p>
                    </div>
                </div>
            </li>
            <li>
                <div class="index-content1">
                    <div class="index-content1-img"><img src="../images/index-hotel-img2.jpg"></div>
                    <div class="index-content1-text no-right-border">
                        <a href="#">三亚旅拍&nbsp;&nbsp;内外景</a>
                        <p><span>¥198</span><del>¥258</del></p>
                    </div>
                </div>
            </li>
        </ul>
    </div>
    <div class="index-line"></div>
    <!--正文-->
    <div class="container">
        <div class="index-container">
            <div class="index-container-title">
                <span>摄像师</span>
            </div>
            <div class="index-container-item1">
                <div class="index-container-item1-box">
                    <a href="#"><h2>三亚旅拍 内外景</h2></a>
                    <div class="index-container-item1-img">
                        <a href="#"><img src="../images/index-hotel-img2.jpg"></a>
                    </div>
                </div>
            </div>
            <div class="index-container-item2">
                <div class="index-container-item1-box">
                    <a href="#"><h2>三亚旅拍 内外景</h2></a>
                    <div class="index-container-item2-img">
                        <a href="#"><img src="../images/banner1.jpg"></a>
                    </div>
                    <a href="#"><h2>三亚旅拍 内外景</h2></a>
                    <div class="index-container-item2-img">
                        <a href="#"><img src="../images/banner1.jpg"></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="index-line"></div>
        <div class="index-container">
            <div class="index-container-title">
                <span>摄像师</span>
            </div>
            <div class="index-container-item1">
                <div class="index-container-item1-box">
                    <a href="#"><h2>三亚旅拍 内外景</h2></a>
                    <div class="index-container-item1-img">
                        <a href="#"><img src="../images/index-hotel-img2.jpg"></a>
                    </div>
                </div>
            </div>
            <div class="index-container-item2">
                <div class="index-container-item1-box">
                    <a href="#"><h2>三亚旅拍 内外景</h2></a>
                    <div class="index-container-item2-img">
                        <a href="#"><img src="../images/banner1.jpg"></a>
                    </div>
                    <a href="#"><h2>三亚旅拍 内外景</h2></a>
                    <div class="index-container-item2-img">
                        <a href="#"><img src="../images/banner1.jpg"></a>
                    </div>
                </div>
            </div>
        </div>
        <div class="index-line"></div>
        <div class="index-container">
            <div class="index-container-title">
                <span>摄像师</span>
            </div>
            <div class="index-container-item1">
                <div class="index-container-item1-box">
                    <a href="#"><h2>三亚旅拍 内外景</h2></a>
                    <div class="index-container-item1-img">
                        <a href="#"><img src="../images/index-hotel-img2.jpg"></a>
                    </div>
                </div>
            </div>
            <div class="index-container-item2">
                <div class="index-container-item1-box">
                    <a href="#"><h2>三亚旅拍 内外景</h2></a>
                    <div class="index-container-item2-img">
                        <a href="#"><img src="../images/banner1.jpg"></a>
                    </div>
                    <a href="#"><h2>三亚旅拍 内外景</h2></a>
                    <div class="index-container-item2-img">
                        <a href="#"><img src="../images/banner1.jpg"></a>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <!--底部导航栏-->
    <div class="index-foot">
        <a href="index-mb.html" class="fa fa-home active"></a>
        <a href="#" class="index-foot-icon"><img src="../images/icon-aa.png"></a>
        <a href="shopping-cart-mb.html" class="fa fa-shopping-cart"></a>
        <a href="person-center-mb.html" class="fa fa-user"></a>
    </div>

    <script src="../librarys/swiper/js/swiper.min.js"></script>

    <!-- Initialize Swiper -->
    <script>
        var swiper = new Swiper('.swiper-container', {
            pagination: '.swiper-pagination',
            paginationClickable: true,
            autoplay: 2500,
            autoplayDisableOnInteraction: false
        });
    </script>
</body>
</html>